<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>代理配置测试</title>
    <style>
        body { font-family: Arial, sans-serif; margin: 20px; }
        .test-section { margin: 20px 0; padding: 15px; border: 1px solid #ccc; border-radius: 5px; }
        button { padding: 10px 20px; margin: 5px; background: #007bff; color: white; border: none; border-radius: 3px; cursor: pointer; }
        button:hover { background: #0056b3; }
        .result { margin-top: 10px; padding: 10px; background: #f8f9fa; border-radius: 3px; white-space: pre-wrap; }
        .success { background: #d4edda; color: #155724; }
        .error { background: #f8d7da; color: #721c24; }
    </style>
</head>
<body>
    <h1>🔧 代理配置测试页面</h1>
    
    <div class="test-section">
        <h3>1. 测试代理请求</h3>
        <button onclick="testProxy()">测试代理路径 (/proxy-default/test/health)</button>
        <button onclick="testDirect()">测试直接路径 (http://localhost:8080/test/health)</button>
        <div id="proxyResult" class="result"></div>
    </div>

    <div class="test-section">
        <h3>2. 测试登录接口</h3>
        <button onclick="testLoginProxy()">通过代理登录 (/proxy-default/auth/login)</button>
        <button onclick="testLoginDirect()">直接登录 (http://localhost:8080/auth/login)</button>
        <div id="loginResult" class="result"></div>
    </div>

    <div class="test-section">
        <h3>3. 当前页面信息</h3>
        <div id="pageInfo" class="result"></div>
    </div>

    <script>
        // 显示当前页面信息
        document.getElementById('pageInfo').innerHTML = `
当前页面地址: ${window.location.href}
当前域名: ${window.location.origin}
时间: ${new Date().toLocaleString()}
        `;

        async function testProxy() {
            const result = document.getElementById('proxyResult');
            result.innerHTML = '🔄 测试中...';
            
            try {
                const response = await fetch('/proxy-default/test/health', {
                    method: 'GET',
                    headers: {
                        'Content-Type': 'application/json'
                    }
                });
                
                const data = await response.text();
                result.className = 'result success';
                result.innerHTML = `✅ 代理请求成功！
状态码: ${response.status}
响应数据: ${data}
请求URL: ${response.url}`;
            } catch (error) {
                result.className = 'result error';
                result.innerHTML = `❌ 代理请求失败！
错误信息: ${error.message}`;
            }
        }

        async function testDirect() {
            const result = document.getElementById('proxyResult');
            result.innerHTML = '🔄 测试中...';
            
            try {
                const response = await fetch('http://localhost:8080/test/health', {
                    method: 'GET',
                    headers: {
                        'Content-Type': 'application/json'
                    }
                });
                
                const data = await response.text();
                result.className = 'result success';
                result.innerHTML = `✅ 直接请求成功！
状态码: ${response.status}
响应数据: ${data}
请求URL: ${response.url}`;
            } catch (error) {
                result.className = 'result error';
                result.innerHTML = `❌ 直接请求失败！
错误信息: ${error.message}
这是正常的，因为存在跨域问题`;
            }
        }

        async function testLoginProxy() {
            const result = document.getElementById('loginResult');
            result.innerHTML = '🔄 测试中...';
            
            try {
                const response = await fetch('/proxy-default/auth/login', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                    body: JSON.stringify({
                        username: 'admin',
                        password: '123456'
                    })
                });
                
                const data = await response.text();
                result.className = 'result success';
                result.innerHTML = `✅ 代理登录请求成功！
状态码: ${response.status}
响应数据: ${data}
请求URL: ${response.url}`;
            } catch (error) {
                result.className = 'result error';
                result.innerHTML = `❌ 代理登录请求失败！
错误信息: ${error.message}`;
            }
        }

        async function testLoginDirect() {
            const result = document.getElementById('loginResult');
            result.innerHTML = '🔄 测试中...';
            
            try {
                const response = await fetch('http://localhost:8080/auth/login', {
                    method: 'POST',
                    headers: {
                        'Content-Type': 'application/json'
                    },
                    body: JSON.stringify({
                        username: 'admin',
                        password: '123456'
                    })
                });
                
                const data = await response.text();
                result.className = 'result success';
                result.innerHTML = `✅ 直接登录请求成功！
状态码: ${response.status}
响应数据: ${data}
请求URL: ${response.url}`;
            } catch (error) {
                result.className = 'result error';
                result.innerHTML = `❌ 直接登录请求失败！
错误信息: ${error.message}
这是正常的，因为存在跨域问题`;
            }
        }
    </script>
</body>
</html> 